<route lang="json5" type="home">
{
  style: {
    navigationStyle: 'default',
    navigationBarTitleText: '农商管理',
  },
}
</route>

<template>
  <div class="h-[100vh] bg-[#f7f7f7] box-border py-10 px-8">
    <div class="text-[#333333] text-[26px]">您好</div>
    <div class="text-[18px] text-[#666666] mt-1">欢迎使用农商管理小程序</div>
    <div class="pt-[65px]">
      <button open-type="getPhoneNumber" @getphonenumber="getPhoneNumber" class="p-0 m-0 leading-none">
        <div
          class="py-4 box-border rounded-2 w-full flex gap-2 text-white justify-center items-center bg-[#56b756]"
          @click="wxLogin"
        >
<!--          <image src="@/static/images/weixin.png" mode="widthFix" class="w-[15px]"></image>-->
          <span>手机号快捷登录</span>
        </div>
      </button>
      <div
        class="py-4 box-border rounded-2 w-full flex gap-2 text-[#56b756] justify-center items-center bg-white mt-4 border border-solid border-[#56b756]"
        @click="toTelecode"
      >
        <image src="@/static/images/phone.png" mode="widthFix" class="w-[15px]"></image>
        <span>手机验证码登录</span>
      </div>
    </div>
    <div class="mt-4 text-[15px] text-[#666666]">
      <wd-checkbox v-model="agree" shape="square">
        已阅读并同意
        <span class="text-[#56b756]" @click.stop="toProtocol">“用户服务协议”</span>
      </wd-checkbox>
    </div>
    <div class="w-fit mx-auto mt-30 text-[#56b756] flex items-center" @click="toRegister">
      新用户注册
      <wd-icon name="arrow-right" size="18px" color="#56b756"></wd-icon>
    </div>
  </div>
</template>

<script setup lang="ts">
import {loginByWx, loginByWxPhone, openId} from '@/service/login'
import { useStorage } from '@/utils/storage'
import { useToast } from 'wot-design-uni'
const { set, setToken, getToken } = useStorage()
const toast = useToast()
const wxCode = ref<string>('')
const agree = ref(false)
const toIndex = () => {
  uni.switchTab({
    url: '/pages/index/index',
  })
}
// 微信登录
const getPhoneNumber = async (info) => {
  if (!agree.value) return toast.show('请先阅读并同意用户服务协议')
  console.log(info, 'getPhoneNumber')
  if (info.detail.errMsg === 'getPhoneNumber:ok') {
    const code = info.detail.code
    // const encryptedData = info.detail.encryptedData
    // const iv = info.detail.iv
    const res: IResData<any> = await loginByWxPhone(code)
    if (res.code === 1) {
      console.log(res, '微信登录')
      setToken(res.data.token)
      toIndex()
    }
  }
}
const wxLogin = async () => {
  if (!agree.value) return toast.show('请先阅读并同意用户服务协议')
  const result: any = await getWxCode()
  if (result.code) {
    const res: IResData<any> = await loginByWx(result.code)
    if (res.code === 1) {
      console.log(res, '微信登录')
      setToken(res.data.token)
      toIndex()
    }
  }
}
const toTelecode = () => {
  uni.navigateTo({
    url: '/pages/login/telecode',
  })
}
const openid = ref<string>('')
const getOpenid = async () => {
  const res: any = await openId(wxCode.value)
  if (res.code === 1) {
    openid.value = res.data.wx_openid
    set('openid', res.data.wx_openid)
  } else {
    await uni.showToast({
      title: res.msg,
      icon: 'none',
    })
  }
}
const toRegister = () => {
  uni.navigateTo({
    url: '/pages/login/register',
  })
}
const getWxCode = () => {
  return new Promise((resolve, reject) => {
    uni.login({
      provider: 'weixin',
      success: (res) => {
        wxCode.value = res.code
        resolve(res)
      },
      fail(result) {
        reject(result)
      },
    })
  })
}
// 用户服务协议
const toProtocol = () => {
  uni.navigateTo({
    url: '/pages/protocol/index',
  })
}
onLoad(async () => {
  if (getToken()) {
    return toIndex()
  }
  await getWxCode()
  await getOpenid()
})
</script>

<style scoped lang="scss"></style>
